@import "./reset";
/* You can add global styles to this file, and also import other style files */
/* 图片自适应 */
img {
  max-width: 100%;
  height: auto;
  width: auto \9; /* ie8 */
  -ms-interpolation-mode: bicubic; /*为了照顾ie图片缩放失真*/
}
.mainP {
  padding: 0.2rem;
}

.padding5{padding: 0.05rem}
/*左右内边距*/

.plr {
  padding: 0 0.2rem;
}

html,body {
  margin: 0 auto;
  width: 100vw;
  min-height: 100vh;
  overflow-x: hidden;
  overflow-scrolling: touch;
}

/*上下内边距*/

.ptb {
  padding: 0.2rem 0;
}


/*上内边距*/

.pt10 {
  padding-top: 0.1rem;
}

.pt15 {
  padding-top: 0.15rem;
}

.pt20 {
  padding-top: 0.2rem;
}

.pt25 {
  padding-top: 0.25rem;
}

.pt30 {
  padding-top: 0.3rem;
}


/*左内边距*/
.pl5 {
  padding-left: 0.05rem;
}
.pl10 {
  padding-left: 0.1rem;
}

.pl15 {
  padding-left: 0.15rem;
}

.pl20 {
  padding-left: 0.2rem;
}

.pl25 {
  padding-left: 0.25rem;
}

.pl30 {
  padding-left: 0.3rem;
}


/*右内边距*/
.pr5{
  padding-right: 0.05rem;
}
.pr10 {
  padding-right: 0.1rem;
}

.pr15 {
  padding-right: 0.15rem;
}

.pr20 {
  padding-right: 0.2rem;
}

.pr25 {
  padding-right: 0.25rem;
}

.pr30 {
  padding-right: 0.3rem;
}


/*nei下内边距*/

.pb10 {
  padding-bottom: 0.1rem;
}

.pb15 {
  padding-bottom: 0.15rem;
}

.pb20 {
  padding-bottom: 0.2rem;
}

.pb25 {
  padding-bottom: 0.25rem;
}

.pb30 {
  padding-bottom: 0.3rem;
}


/*上外边距*/

.mt10 {
  margin-top: 0.1rem;
}

.mt15 {
  margin-top: 0.15rem;
}

.mt20 {
  margin-top: 0.2rem;
}

.mt25 {
  margin-top: 0.25rem;
}


/*模块下边距*/

.mt30 {
  margin-top: 0.3rem;
}


/*下外边距*/
.mb5{
  margin-bottom: 0.05rem;
}
.mb10 {
  margin-bottom: 0.1rem;
}

.mb15 {
  margin-bottom: 0.15rem;
}

.mb20 {
  margin-bottom: 0.2rem;
}

.mb25 {
  margin-bottom: 0.25rem;
}
.mb40 {
  margin-bottom: 0.4rem;
}


/*模块下边距*/

.mb30 {
  margin-bottom: 0.3rem;
}


/*左外边距*/

.ml10 {
  margin-left: 0.1rem;
}

.ml15 {
  margin-left: 0.15rem;
}

.ml20 {
  margin-left: .2rem;
}

.ml25 {
  margin-left: 0.25rem;
}

.ml30 {
  margin-left: 0.3rem;
}


/*右外边距*/

.mr10 {
  margin-right: 0.1rem;
}

.mr15 {
  margin-right: .15rem;
}

.mr20 {
  margin-right: 0.2rem;
}

.mr25 {
  margin-right: 0.25rem;
}

.mr30 {
  margin-right: 0.3rem;
}


/*圆形 圆角50%*/

.bdrs50 {
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  border-radius: 50%;
}


/*普通圆角边框*/

.bdrs10 {
  -webkit-border-radius: 0.1rem;
  -moz-border-radius: 0.1rem;
  border-radius: 0.1rem;
}

.bdrs15 {
  -webkit-border-radius: 0.15rem;
  -moz-border-radius: 0.15rem;
  border-radius: 0.15rem;
}

.bdrs20 {
  -webkit-border-radius: 0.2rem;
  -moz-border-radius: 0.2rem;
  border-radius: 0.2rem;
}


/*文字居中*/

.text-center {
  text-align: center;
}
.text-right {
  text-align: right;
}


/*单行溢出隐藏*/

.line-hide {
  -ms-text-overflow: ellipsis;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}


/*一级主标题*/

.mainH1Title {
  font-size: 0.3rem;
  color: #333;
}


/*二级副标题*/

.mainH2Title {
  font-size: 0.25rem;
  color: #666;
}

.input-title {
  color: #4f4f4f;
  font-size: 0.3rem;
}

.input-border {
  border: 1px solid #e6e6e6;
}


/*首行缩进*/

.text-indent {
  text-indent: 2em;
}


/*字体大小*/

.font-size20 {
  font-size: 0.2rem;
}

.font-size25 {
  font-size: 0.25rem;
}

.font-size30 {
  font-size: 0.3rem;
}
.font-size35 {
  font-size: 0.35rem;
}
.font-size40 {
  font-size: 0.4rem;
}


/*字体颜色*/


/*内容字体颜色*/

.color-default {
  color: #333333;
}


/*白色字体*/

.color-white {
  color: #ffffff;
}
.color-black{
  color: #000;
}

/*橘色字体*/

.color-333 {
  color: #333;
}

.color-666 {
  color: #666;
}
.color-999{
  color: #999;
}


/*背景颜色*/
/*白色背景*/
.bg-white {
  background-color: #ffffff;
}
/*模块显示隐藏 不占空间*/
.model-hide {
  display: none;
}
.model-show {
  display: block;
}
/*模块显示隐藏 占空间*/
.mode-visible-hide {
  visibility: hidden;
}
.mode-visible-show {
  visibility: visible;
}
/*字体加粗*/
.font-weight {
  font-weight: bold;
}
.opacity{
  animation: show ease 1000;
}
@keyframes show {
  0% {
    opacity: 0;
  }
  50% {
    opacity: 0.5;
  }
  100% {
    opacity: 1;
  }
}
/*透明背景层*/
/*最大宽度*/
.maxWidth {
  width: 100%;
  max-width: 750px;
}


@mixin bdrs50 {
  -moz-border-radius: 50%;
  -webkit-border-radius: 50%;
  border-radius: 50%;
}
@mixin line-hide {
  overflow: hidden;
  text-overflow:ellipsis;
  white-space: nowrap;
}
.text-overflow{
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap
}

/* fade */
.fade-enter-active,
.fade-leave-active {
  transition: opacity 0.3s;
}

.fade-enter,
.fade-leave-active {
  opacity: 0;
}
/* slide */
.slide-enter-active, .slide-leave-active{
  transition:all 0.3s;
}
.slide-enter{
  transform: translate3d(100%, 0, 0);
  opacity: 1;
}
.slide-leave-to{
  transform: translate3d(-100%, 0, 0);
  opacity: 0;
}
